<template>
<div class="common-layout">
    <el-container>
      <!-- 左侧菜单 -->
        <Aside />
      <el-container>
        <!-- 中间顶部 -->
        <el-header>
          <Header />
        </el-header>
        <!-- 中间内容 -->
        <el-main>
          <router-view v-if="route.path !== '/'" />
          <div class="mainConter" v-else>
            <h1>欢迎来到管理系统</h1>
          </div>
        </el-main>
      </el-container>
    </el-container>
  </div>
</template>

<script setup lang="ts">
  import Aside from '../components/aside.vue';
  import Header from '../components/navHeader.vue';
  import { useRoute } from 'vue-router';
  const route = useRoute();
</script>

<style scoped lang="less">
.common-layout{
  height: 100%;
  .el-container{
    height: 100%;
  }

  .mainConter{
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%; 
    h1{
      font-size: 50px;
      font-weight: bold;
      color: #999;
    }
  }
}
</style>
